<div class="form-box container" style="padding: 35px 35px 15px;">
  <form nz-form [formGroup]="brandForm" (ngSubmit)="submitForm()">
    <nz-form-item nzJustify="center">
      <nz-form-label nzSpan=4 nzRequired>品牌名称</nz-form-label>
      <nz-form-control nzSpan=20 nzHasFeedback nzErrorTip="请输入品牌名称">
        <input nz-input nzSize="large" formControlName="name" >
      </nz-form-control>
    </nz-form-item>
    <nz-form-item nzJustify="center">
      <nz-form-label nzSpan=4>品牌首字母</nz-form-label>
      <nz-form-control nzSpan=20>
        <input nz-input nzSize="large" formControlName="firstLetter">
      </nz-form-control>
    </nz-form-item>
    <nz-form-item nzJustify="center">
      <nz-form-label nzSpan=4 nzRequired>品牌LOGO</nz-form-label>
      <nz-form-control nzSpan=20>
        <nz-upload [nzAction]="fileUploadURL" nzListType="picture" [(nzFileList)]="logoFileUploader.fileList" [nzSize]="10000"
          [nzRemove]="logoFileUploader.removeFile" (nzChange)="handlelogoFileChange($event)"
          [nzShowButton]="logoFileUploader.fileList.length < 1 && name.valid" [nzData]="getLogoExtraData">
          <button nz-button nzType="primary" type="button"><i nz-icon nzType="upload"></i>点击上传</button>
          <div>只能上传jpg/png文件，且不超过10MB</div>
        </nz-upload>
        <div *ngIf="logo.invalid && (logo.dirty || logo.touched)" class="error-message">请上传品牌logo</div>
      </nz-form-control>

    </nz-form-item>
    <nz-form-item nzJustify="center">
      <nz-form-label nzSpan=4>品牌专区大图</nz-form-label>
      <nz-form-control nzSpan=20>
        <nz-upload [nzAction]="fileUploadURL" nzListType="picture" [(nzFileList)]="bigPicFileUploader.fileList" [nzSize]="10000"
          [nzRemove]="bigPicFileUploader.removeFile" (nzChange)="handleBigPicFileChange($event)"
          [nzShowButton]="bigPicFileUploader.fileList.length < 1 && name.valid" [nzData]="getBigPigExtraData">
          <button nz-button nzType="primary" type="button"><i nz-icon nzType="upload"></i>点击上传</button>
          <div>只能上传jpg/png文件，且不超过10MB</div>
        </nz-upload>

      </nz-form-control>
    </nz-form-item>
    <nz-form-item nzJustify="center">
      <nz-form-label nzSpan=4>品牌故事</nz-form-label>
      <nz-form-control nzSpan=20>
        <textarea nz-input formControlName="brandStory"></textarea>
      </nz-form-control>
    </nz-form-item>
    <nz-form-item>
      <nz-form-label nzSpan=4>排序</nz-form-label>
      <nz-form-control nzSpan=20 nzHasFeedback nzErrorTip="排序必须为数字">
        <input nz-input nzSize="large" formControlName="sort">
      </nz-form-control>
    </nz-form-item>
    <nz-form-item nzJustify="center">
      <nz-form-label nzSpan=4>是否显示</nz-form-label>
      <nz-form-control nzSpan=20>
        <nz-radio-group formControlName="showStatus">
          <label nz-radio [nzValue]="1">是</label>
          <label nz-radio [nzValue]="0">否</label>
        </nz-radio-group>
      </nz-form-control>
    </nz-form-item>
    <nz-form-item nzJustify="center">
      <nz-form-label nzSpan=4>品牌制造商</nz-form-label>
      <nz-form-control nzSpan=20>
        <nz-radio-group formControlName="factoryStatus">
          <label nz-radio [nzValue]="1">是</label>
          <label nz-radio [nzValue]="0">否</label>
        </nz-radio-group>
      </nz-form-control>
    </nz-form-item>
    <button nz-button nzType="primary" type="submit">提交</button>
    <button nz-button *ngIf="!brand?.id" type="button" (click)="handleReset()">重置</button>
  </form>

</div>
